En algunas páginas personales vemos un efecto que llama mucho la atención, es una imagen de fondo estática, da la sensación que las entradas del blog van ascendiendo y el fondo queda fijo.
¿Cómo conseguirlo?
Nos situamos en:

body {
background:#ffffff;


Lo primero que vamos a hacer es aplicar la imagen de fondo, #ffffff; es el color de fondo mi blog, en vuestro caso puede ser un color distinto, vamos a sustituirlo por una imagen y lo vamos a hacer sustituyendo #ffffff; por: url('aquí la url de tu imagen de fondo');

De manera que quedaría así:
body {
background:url('aquí la url de tu imagen de fondo');

Ya tenemos una imagen de fondo y ahora vamos a hacer que dicha imagen quede estática, para ello aplicamos background-attachment: fixed; después de la imagen de fondo.

Si la imagen es pequeña lo más probable es que se repita, deberemos añadir el atributo no-repeat; para que esto no suceda.
background-repeat: no-repeat;

Una vez terminado quedaría más o menos así:
body {
background:url('aquí tu imagen de fondo');
background-attachment: fixed;
background-repeat: no-repeat;


(Suerte David, que el trabajo de la Uni salga estupendo)

alida

Buenos días Gem@, y en mi blog aunque yo pongo muchas fotos, ¿se vería bien?
Saludos y felicitaciones

Responder
4t0rRaNt3

Hola Gem@

Pase a visitarte, y vi el post de imagen de fondo, muy bien, me gusta la info que das en tu blog, sigue adelante con fuerza.
Un Saludo
Narko-Team
Osvaldo

Responder
alida

amiga no me sale, o me sale abajo o arriba cortado pero no como tu ejemplo
Saludos

Responder
Anónimo

hola Gema ! una pregunta como puedo hacer para que la foto me quede grande!! de que medida la tendria que crear !! y luego donde la alojo para copiar el link
salu2

Responder
Gem@

Hola Alida, la plantilla Harbor que usas está compuesta por varias imágenes hay que eliminarlas para poder aplicar una única imagen de fondo.

Saludos Osvaldo la última plantilla diseñada es una maravilla.
Gracias por estar;)

Saludos Hernan bienvenido, la imagen que he utilizado para el ejemplo es de 555 de ancho por 416 de alto, el tamaño del archivo es de 52.27 KB
Puedes alojarla en http://www.imageshack.us/ no es necesario registro ;)
Suerte¡

Responder
MacTrucos

Hola Gema !! tengo una pregunta que no tiene que ver con este tema, disculpa que la ponga aqui !!
Como se puede poner algo escrito dentro de la cajita del buscador que pongamos en el blog?
ejemplo , scribe aqui dentro]
no se si me explico gracias de antemano salu2

Responder
Anónimo

Hola Gema como te va tanto tiempo.. necesito un favor, que me ayudes en algo, no se como hacer para que nos escribamos y te explique...entra a mi blog y dejame mensajito en el chat si llegas a leer esto.. gracias besote

Responder
Gem@

MacTrucos el buscador que yo tengo es un buscador interno, para buscar dentro del blog, no he podido añadirle ningún texto por eso lo tengo justo arriba :(

Hola No te salves si que hace tiempo amiga, tengo un enlace a mi correo en forma de botón en la sidebar del blog, GMAIL ME ;)
Voy a dejarte ese mensajito.

Responder
alida

Buenas tardes Gem@, pues nada lo dejare así, hasta busque todas las palabras con ctrl f
gracias un beso
PD/algun día cambiare la plantilla
http://img129.imageshack.us/img129/4695/latortugarl1.jpg

Responder
Anónimo

Hola.
Buscando y buscando he caído por aquí... Mi pregunta no es cómo dejar el fondo fijo, pues en todos mis blog siempre ha estado de esta manera. Mi pregunta es ¡¿Qué narices he tocado?!
Verás, desde mi resolución de pantalla (1280×800), mi blog se ve estupendo, pero desde cualquier otra resolución... se despatarra. Y es que la imágen no se adapta al tamaño de la pantalla, se queda tal cual, ocasionando que el texto y la sidebar se descentren del marco blanco de mi fondo ¿Cómo podría solucionarlo? ¿tiene algo que ver con que las medidas sean en porcentajes y no en pixeles?
Espero que tengas la solución... Muy agradecida de antemano. Sin las pocas personas que hacéis este tipo de blogs, la mayoría estaríamos perdidos.

Responder
Gem@

Saludos Alida, no te rindas por tener que eliminar unas imágenes, si estás decidida a cambiar el aspecto del blog hazlo aunque pierdas en ello unas cuantas horas.
Para que todo se haga con la garantía de salir bien, probaré antes en un blog de pruebas y si resulta entonces te aviso y tu decides si seguir los pasos o quedarte con la misma plantilla hasta que cambies por otra, por cierto viste las de Narko-Tean?

Saludos Iria, es obvio que eso no pasaría con un fondo de color, es por eso que los que tenemos blogs con resolución de 800x600 al acceder a páginas cuya resolución es mayor encontramos la sidebar escondida en uno de los extremos.
La solución sería ampliar tu imagen para que al acceder a mayor resolución se pudiera visionar completamente sin el efecto, lamento no poder ayudarte en ese problema pero puedo dejarte un enlace de alguien que entiende bastante sobre este tema, al menos en su día posteó sobre styleswitch.
http://vagabundia.blogspot.com/
Te deseo suerte ;)

Responder
Antonio

Aunque no corresponde a este link.
Gema, tengo un problemilla con las etiquetas en mi cabecera. Cuando visito la página con explorer funciona ok; sin embargo, cuando utilizo el Firefox, se quedan ocultas ¿¿why??.
www.cdasanmar.blogspot.com
Si tienes un ratillo pégale un vistazo, please.
Gracias

topari@ono.com

Responder
Anónimo

¡Genial! Muchas gracias por el link, creo que puede ser la mejor solución.

Responder
Anónimo
Este comentario ha sido eliminado por el autor.
Responder
Gem@

Hola Antonio ese es un problema muy frecuente respecto a diferencias de navegadores, he repasado tu plantilla y lo único que veo diferente es que las etiquetas, o sea el paso dos no van incluidas antes de b:skin.
Yo lo que haría sería acceder a tu plantilla con Explorer y probar a insertar las etiquetas un poco más abajo de donde las tienes, lo ideal sería como te digo antes de b:skin.
De todas formas piensa que ya somos mayoría los usuarios de Firefox aunque se que eso no te ayuda nada :(

Saludos Iria me alegra verte :)

Responder
andresd

Hola que tal Gem@... me sirvió bastante lo del fondo estatico... me gustaria saber como puedo poner una columna a cada lado de la pagina, no una como es normalmente sino a ambos. gracias... visita mi blog principal polo opuesto

Responder
Petitabruixa

Hola, Gemma!

Mira, que me a mí me pasaba lo mismo que a Alida y he eliminado el background-repeat: no-repeat; y me ha funcionado perfectamente.

Qué contenta estoy!!!!

Besos!!!

Responder
Gem@

Saludos Andresd es un poquito largo de explicar pero intentaré hacerlo mañana mismo, si no te importa lo explicaré en un post y así aprendemos todas ;)

Saludos Petitabruixa la plantilla de Alida contiene varias imágenes, es la Harbor, si aplica un fondo sin suprimir esas imágenes saldrán superpuestas al fondo.
Lo que tu hiciste es eliminar el código para que la imagen no se repita, eso no afecta si es una imagen tipo textura, pero si es un paisaje por ejemplo y de un tamaño inferior al fondo del blog la imagen se repetirá ;)

Responder
Magenta Girl

Solo quería agradecer por el dato.. tengo un bonito fondo en mi blog gracias a ti

Responder
Gem@

Muchas gracias Margenta ;)

Responder
Anónimo

Hola, gema, recientemente descubri tu site y te enlace con mi blog, eres excelente instructora, me parece que tu blog y páginas web están a un nivel muy bueno, felicidades y gracias por tan buenos consejos. Leny desde el caribe

Responder
Gem@

Gracias Leny comentarios así alegran el día a cualquiera ;)

Responder
Ávalos

Hola de nuevo Gema. Aunque esta entrada es de hace días, no puedo más que darte las gracias y de paso pedirte auxilio bloguero. Le he puesto la consabida imagen de fondo al blog (www.shirowsama.blogspot.com) y si tienes mucha resolución de pantalla o un monitor grande verás que queda por la derecha y por abajo un margen blanco que no cubre la imagen. Digo yo que si se puede cambiar ese color blanco por el negro y así no se ve el asunto.
Gracias de nuevo, ahora que tengo un ratejo libre por las noches me estoy empapando de diseño de blogs(antes ni papa) pero no sé si de tanto empaparme voy a terminar ahogado xD.
Saludos

Responder
Gem@

Mi resolución es de 800 Batou :( pero sé a lo que te refieres.
Intenta solucionarlo poniendo un color de fondo al blog de la siguiente manera:
(pero no toques la imagen de fondo)
Sitúate en este orden:
Panel/Diseño/Fuentes y colores
Añade ahí el color negro como Color de fondo de la página y mira en la ventana de abajo la vista previa del cambio.
Si no se elimina la imagen que creo que no, guardas los cambios y comprueba si eso ha añadido un color detrás de la imagen.

Responder
Anónimo

Hola gema, vuelvo a la carga quiero poner una imagen en los comentarios que deje en otros blogs, y no sé si lo has explicado ya supongo que si, pero no logro dar con ello...
Un saludo
Susana

Responder
Ávalos

Desgraciadamente sigue de color blanco :(. No pasa naaa, o agrando la imagen o la quito directamente. Muchas gracias por tu atención ;)

Responder
Gem@

Hola Susana mira aquí:
http://gemablog-.blogspot.com/2007/04/aadir-una-imagen-al-perfil.html
Si te surgen dudas házmelo saber ;)

Batou tengo que probar en mi blog de pruebas eso que dices, debe haber alguna forma, pero la más indicada es esa que dices, que la imagen sea de mayor tamaño.

Responder
Begotxu

Hola Gemma estoy desesperada , no soy capaz de cambiar el fondo delblog, creo que voy a tirar la toalla , necesito tu ayuda, es que yo de esto no entiendo nada y me cuesta mucho.
Tengo un blog de pruebas narobi y ahi he intentado pero no me sale nada y he seguido tus pasos.
Me gustaria cambiarlo porque lo que tengo no me gusta nada.
Ayudame por favor si te hace falta te mando mis claves.
Gracias.

Responder
Gem@

Begotxu no te desesperes que casi todo tiene arreglo.
Veamos... estás utilizando la plantilla Thisaway (Rose)y dices que deseas añadir una imagen de fondo, te explico...
La imagen de fondo quedará bien, pero solo se verá un borde de la imagen porque las entradas y la sidebar llevan otro enmarcado.
Para que veas lo que te digo situate en
/* global------------ */
body {
margin: 0;
text-align: center;
min-width: 760px;
background: #ce436e url(aquí-pones-la-url-de-tu-imagen) repeat-x left top;
color: #632035;
font-size: small;
}

Debes añadir la url de tu imagen de fondo donde te lo indico, y eliminar lo que está en negrita.

Ahora mira en vista previa que veas a lo que me refería.
Te quedará algo así.

Responder
Jeyvé Maldonado

Gracias!! Gracias!!! Miles de Gracias!! No sabes cuanto me ha costado.. Pero lo logré gracias a tus indicaciones.. Puedes visitar mi Blog y ves el resultado..
http://meacd.blogspot.com

Gracias de nuevo
Desde Venezuela.. en enorme abrazo

Responder
Gem@

Otro abrazo para ti Jeyve me alegra que consiguieras tu propósito ;)

Responder
Anónimo

Hola Gem@, bueno trate de hacer lo de imagen fija prove un monte de dimenciones aun asi me queda un espacio en blanco del lado derecho, si tienes alguna solucion para mi desde ya te lo agradesco.
Tu blog es lo maximooo!

Responder
Gem@

Hola Patricia debe ser por el tamaño de la imagen prueba con una mayor para ver si es ese el problema.
Cuando se trata de una imagen tipo textura no es problema porque suprimimos background-repeat: no-repeat; de ese modo la imagen se repite. Pero tratándose de una imagen no debe repetirse hay que buscar una que de la medida adecuada.

Responder
Anónimo

Hola, esta bueno eso del fondo estatico, pero yo tengo una imagen chica y cuando la pongo me la pone a la izquierda de la pantalla y arriba, como puedo hacer para que la imagen me aparesca a la derecha y en el medio de la pantalla siempre estatica, desde ya gracias y esta muy bueno el blog saludos a todos

Responder
Gem@

Yoyito tu lo que deseas es que tu blog tenga una imagen como fondo o te refieres a una imagen en el centro como encabezado de página?

Responder
Anónimo
Este comentario ha sido eliminado por el autor.
Responder
Anónimo
Este comentario ha sido eliminado por el autor.
Responder
Anónimo

Hola Gem@ ... Como lo hago para extender mi imagen de fondo ?

Responder
Gem@

XBleedinGXMaGGoTX :Suprimiendo background-repeat: no-repeat;
esto último lo que hace es que nuestra imagen no se repita.
Pero ya sabes que en el caso de ser una imagen pequeña se repetirá por toda la pantalla (tipo mosaico)
Si deseas que la imagen ocupe todo el blog debes añadir la url de la imagen en el tamaño indicado ;)

Responder
Anónimo

De peluche tu aportacion ehh!!!
si kieres visitarme en:
http://tifosibianconeri.blogspot.com/

es de futbol por si kieres pasar a mirar nada mas...

gracias.

Responder
Gem@

Te ha quedado fantástico José Ángel ¿Para cuando el logo?

Responder
Anónimo

Funciona para todo tipo de pantalla?

Responder
Gem@

XBleedinGXMaGGoTX no afecta para nada la resolución de pantalla ;)

Responder
lalova

hola wapa: soy una cyber-mari47 malagueña que colaboro con la gran pasion de mis hijos difundiendo el voley.Tengo varios blogs, poco a poco hago mis pinitos...
http://voleyplayadeamolopez.blogspot.com/
Intento poner de fondo una foto muy bonita pongo url pero no lo consigo.
¿podrias darte una vuelta y aconsejarme?
Se que lo intentaras.
Muchissssimas gracias

Responder
Gem@

Saludos lalova bienvenida ;)
Prueba a sustituir la url de la imagen por esta otra:
http://lh5.google.es/pizarruma/R-0nQc8qRNI/AAAAAAAAF3g/cCAv8Tj3Ugw/Zapillo%200678%5B1%5D.JPG.jpg?imgmax=512
Lo que añadiste es la url de la página de picasa donde se muestra la imagen.
Para conseguir la url de una imagen sitúa el ratón sobre la imagen, pulsa botón derecho y luego en propiedades.
Te muestra la información de la imagen, debes copiar en propiedades de imagen la dirección. Esa es la url de la imagen ;)

Responder
Unknown

Hola Gem@, estoy cambiando el fondo de un blog por una imagen y la misma se me repite y quisiera que ocupara "expandida" todo el ancho de la pantalla, he probado con no-repeat y se ubica en un rincon de la misma, he probado con imagenes de diversos tamaños y me sucede los mismo, me podrías dar una mano para que esto no suceda? Gracias! Saludos...!

Responder
Gem@

Lala la medida total de tu blog es 660 lo ideal sería que la imagen tenga la misma medida.
Intenta añadir lo siguiente:

background-image:url(urldelaimagen);
background-attachment: fixed;
background-position: bottom center;
background-repeat: no-repeat;

De esta forma la imagen tenga la medida que tenga debería quedar centrada, si ves que no ocupa todo el blog entonces habría que ampliarla con algún editor.

Responder
L-E

gem@, escribo para agradecerte, gracias a tus consejos he mejorado mi blog, que te invito a visitar!!

muchísimas gracias

Responder
Anónimo

Hola Gema, lo primero agradecerte tu rápida respuesta con los botones desplegables que te pedí ayer. He puesto dos en la página principal, uno es el mismo traductor que tienes tu (quería poner otro diccionario y no fui capaz) y otro que vincula al segundo blog. Me gustaría ahora poner otro desde el segundo blog hasta el primero; lo he intentado cambiando la palabra traductor por volver, y no me sale, se queda el espacio en blanco.
No te extrañes, es que soy muy novata en esto, pero le estoy cogiendo afición. También me gustaría cambiar el color de la parte mas pequeña del botón y no se. Bueno,si tienes tiempo y puedes me echas un cable, si no, lo dejamos como está. Si quieres echarle un vistazo es: http://samogaathome.blogspot.com/ (es para niños de 8 a 10 años, para que aprendan inglés, que les va a hacer mucha falta... Besotes

Responder
Gem@

Quasar J-01 soy yo la que debe agradecer tu invitación, ha sido muy grato visitar tus blogs y llegar a conocerte ;)
Realmente fantástico, en serio...

Aseret prueba de ese modo para añadir ese botón de volver.
<a href="javascript:void(0);" onclick="expandcollapse('Volver')">
<img border="0"src="http://img186.imageshack.us/img186/4555/traductorhp5.gif"/>
</a><br/>
<ul id="Volver" class="texthidden">
<li><a href="url-de-la-pagina" target="_blank"> texto </a></li></ul>

Responder
Gem@

Elimina ese <br/> que ha salido después de la imagen.
Ya me dirás el resultado ;)

Responder
Anónimo

Hola gema! quiero poner una imagen de fondo a los laterales del blog en http://paraninosconcabeza.blogspot.com. es decir que el fondo de las entradas y del sidebar tengan el fondo de color que hay ahora pero los laterales una imagen. ¿cómo lo puedo hacer???? lo que más o menos quiero es esto
http://www.kitschkitchen.nl/product/product_uk.php?cat_nr=2

Responder
Gem@

S.O.S es sencillo si manejas bien un editor o programa de imágenes, te explico...
La plantilla Minima es una plantilla con todo el fondo del mismo color, si añadimos una imagen de fondo el efecto sería que esa imagen ocuparía las entradas y sidebar.
Para añadir una una imagen únicamente a los laterales necesitas una imagen que muestre sólo la imagen en esos laterales y en el centro (parte de entradas y sidebar) sea del color de tu blog.
Al mismo tiempo tiene que tener la misma medida que el ancho del blog, es decir width: 660px; que es la medida de outer-wrapper.
Yo no domino bien esos temas pero sería algo así, para que te hagas una idea.

Responder
Anónimo

muchísimas gracias gemA!! no se me hubiera pasado x la cabezza!

Responder
Gem@

Suerte S.O.S ;)

Responder
Anónimo

Esto está de lujo!

Ya lo había hecho pero no sabía lo de hacerla estática con este pedazo de código:

background-attachment: fixed;

Solo tuve que quitarle el "no-" al código: background-repeat: no-repeat; por que queria que se repitiera jeje...

Creo que me quedó bien ;)

Muchas gracias y saludos!

Responder
Osk@r

Que guapo el blog! Me podrias hechar un cable con el tema de los comentarios. Me gusta mucho como te ha quedado a ti. Como hago para darle un cambio a lo "x comentarios". Pasate x mi blog si kieres y dime algo. Gracias y un saludo

Responder
Gem@

Me alegra que te haya resultado bien Eddie, y si, lo que ha quedado de lujo es tu blog :)

Hola Osk@r mis comentarios están modificados yo diría de principio a fin, pero tú también puedes hacerlo. Ahora bien, me preguntas por modificar la parte que dice "x comentarios" y eso es el texto justo debajo de las entradas, en esa parte puedes añadir un icono o cambiar el texto por uno de tu agrado.
Si fuera otra cosa házmelo saber :)

Responder
Charlie

Me sale el fondo blanco y no hay manera de que se vea la foto; me puedes echar un cable???
Aqui estan las lineas, una vez sustituidas...
(obviamente no están bien sustituidas, ajajaaja)
Gracias!!!


body {
background:["URL=http://www.slide.com/s/4fJ5AC0W6j-B3CCHhuonwl3w5zkBcLMH?referrer=hlnk][IMG]http://widget.slide.com/rdr/1/1/3/W/160000000b2c3ac0/1/138/QOoEP1orwD-KZBqdv18H-Ho0R_FnNkEB.jpg[/IMG][/URL]");
background-attachment: fixed;
background-repeat: no-repeat;
margin:0;
text-align:center;
line-height: 1.5em;

Responder
Gem@

Está todo bien Charlie excepto la url del enlace ;)
Donde hay que añadir la url de la imagen estás añadiendo la url de la página donde se encuentra la imagen, para conseguir la url de la imagen puedes clicar sobre la imagen y copiar la url que aparece en la barra de direcciones.
Aunque lo correcto sería guardar la imagen en tu PC y alojarla en un servidor para conseguir la url.
De esta forma no estás utilizando el alojamiento del autor de la página con el consiguiente problema de superar la banda ancha y al mismo tiempo evitas que si en un futuro la página dejara de funcionar perdieras la imagen de tu blog ;)
¿La mejor solución?
Ratón sobre la imagen, botón derecho, guardar como...
Alojarla en un servidor y añadir al código tu propia url :)

Responder
Anónimo

hola muy buenas como puedo poner una foto que ocupe toda la pantalla, la cambio de tamaño con photoshop y la subo otra vez pero siempre me sale igual en el blog.gracias

Responder
Anónimo

hola, la imagen que subo no ocupa toda la pantalla, hay algun parametro que le puedqa aplicar para que esto suceda, algo tipo cuando en el fondo de escritorio ponemos centrar, en mosaico o expandir?, espero haberme hecho entender, grasias por tu tiempo.

PD: Importa el formato de la imagen?

Responder
Anónimo

ya encontre la solucion por mimismo, grasias de todos modos por tu ayuda, hay muchas cosas de utilidad en tu blog, suerte!

Responder
Gem@

Hola SHARCK cuando la imagen es una textura podemos solucionarlo añadiendo la propiedad background-repeat: no-repeat; eso hace que la imagen se repita ocupando todo el blog. Si por el contrario es una imagen le podemos añadir background-repeat; si como en tu caso no se extiende a todo el blog sino que queda situada en un extremo sería conveniente que probaras añadiendo también text-align:center; si no te resulta bien hazme saber el tamaño de la imagen.
Sobre el formato de archivo el más utilizado es jpg. :)

Responder
Gem@

Llegué tarde pero me alegra que lo resolvieras :)

Responder
Ana

Hola

llevo intentando poner uno de los fondos,pero antes de dar a confirmar,me pide para borrar la navbar.Si le doy acceptar luego no puedo acceder al menu del blogger.

¿Que es lo que estoy haciendo mal?

Gracias por ayudar

Responder
Gem@

Hola Ana, para añadir una imagen de fondo no debes eliminar la barra, lo que haces mal no puedo saberlo ya que no sé donde estás añadiendo el código. Mira bien desde el principio y sigue los pasos como está indicado seguramente te confundiste de lugar anteriormente :)

Responder
Licity Pub

hola gema

Responder
Victor

Muy buenooo graxs a esto pude poner la imagen de fondo en mi blog que tenia mucho tiempo intentando colocarla

Responder
Gem@

Hola Lucas :)

Responder
Gem@

Te ha quedado fantástico Victor, me alegra mucho :)

Responder
picheleiro

no se donde puedo alojar la foto que quiero poner como fondo de mi blog de blogger. gracias

Responder
picheleiro

la he intentado alojar en la pagina que has dado arriba http://load.imageshack.us/, pero no soy capaz...

Responder
Gem@

picheleiro para subir una imagen haz clic en Examinar. (busca la imagen en tu PC)
Luego clic en el botón host it¡
Cuando ha terminado de cargar te muestra varias url debes copiar la que está junto a Direct link to image
Suerte ;)

Responder
picheleiro

muchas gracias, ya lo logre, pero lo uqe no sé hacer es sacar tantos cuadros que me aparecen en el ancabezamiento del blog, mira:
http://www.sdcompostela.tk/

Gracias

Responder
Gem@

Esos cuadros están impresos en la imagen del logo, para eliminarlos debes suprimir la imagen de la cabecra que viene por defecto en la plantilla, he mirado tu código fuente pero creo que lo has encriptado y no puedo verlo.
Busca más o menos por header y verás una dirección url de la imagen puedes quitarla (sin guardar cambios) y mira en vista previa si es eso lo que deseas quitar entonces guarda los cambios y listo ;)

Responder
Anónimo

Si se ha ido , muchísimas gracias, ahora lo malo es que la foto que puse de encabezamiento queda torcido a la izquierda...

Responder
Gem@

Prueba a eliminarla y súbela añadiéndola como un elemento de página de la cabecera.
Si no te resulta centrada entonces dime lo que mide la imagen de ancha y la medida que tienes en #header-wrapper {

Responder
Anónimo

La imagen original en propiedades pone ancho 573 píxeles alto 238 píxeles, resolucion horizontal 96 ppp resolucio vertical 96 ppp y en html pone:#header-wrapper {
margin: 0;
padding: 0;
font: $pagetitlefont;
background: #e0e0e0 url
#header {
margin: 0;
padding-top: 25px;
padding-$endSide: 60px;
padding-bottom: 35px;
padding-$startSide: 160px;
color: $pagetitlecolor;
background: url(http://www.blogblog.com/tictac_blue/top_h1.gif) no-repeat bottom $startSide;

Responder
picheleiro

tambien me interesaria si es posible quitar donde pone los dias de las cosas que pongo en el blog---Perdona por preguntar tanto y te lo agradezco mucho, eres muy amable

Responder
Gem@

Hola picheleiro veamos si arreglamos ese problema, hay que centrar el logo en #header { sustituye padding-top: 25px; por padding-top: 5px; eso lo centrará.
Y en padding-bottom: 35px; por padding-bottom: 5px; hará que no quede tan despegado de la parte superior.
No sé si al modificando esa parte o al copiar el código pero has suprimido los cierres que se añaden en las CSS es algo así: }

Si quieres puedes sustituir el código que e has mandado por este:

#header-wrapper {
margin: 0;
padding: 0;
font: $pagetitlefont;
}

#header {
margin: 0;
padding-top: 5px;
padding-$endSide: 60px;
padding-bottom: 5px;
padding-$startSide: 160px;
color: $pagetitlecolor;
background: url(http://www.blogblog.com/tictac_blue/top_h1.gif) no-repeat bottom $startSide;
}

La fecha la puedes suprimir si accedes a la plantilla de diseño, donde Entradas del blog haces click en Editar, ahí marcas sólo lo que deseas que aparezca fecha, hora, ect.. :)

Responder
Anónimo

GRACIASSS Ha quedado centradísimo,míralo: www.sdcompostela.tk que alegría me has dado, eres una Crack, gracias y mil gracias :)

Responder
picheleiro

Si no es mucho abusar...podrías decirme como poner una foto que se repita una encima de la otra la misma foto en los dos laterales del blog? Gracias y perdón por preguntar tanto

Responder
Gem@

picheleiro añadir una imagen de fondo puedes hacerlo en body { añadiendo:

background:url('aquí la url de tu imagen de fondo');
Eso hace que añadas una imagen de fondo, si es una textura se expandirá por todo el fondo, pero si lo que deseas es una imagen en los laterales (a ambos lados del blog) lo que necesitas en crear esa imagen y que el motivo de la imagen quede en los extremos justo donde deseas que aparezca. ;)

Responder
Anónimo

si, eso era lo que habia leido en los post anteriores, pero no me sale, he hecho lo que me has dicho ahora y me sale en la parte central una foto que no se de donde ha salido y queda estatica y hace que el blog se descoloque todo... sin tocar nada el html esta asi:
body {
margin: 0;
padding: 0;
font-size: small;
text-align: center;
color: $textcolor;
background: #99C9FF;
}

blockquote {
margin-top: 0;
margin-$endSide: 0;
margin-bottom: 0;
margin-$startSide: 30px;
padding-top: 10px;
padding-$endSide: 0;
padding-bottom: 0;
padding-$startSide: 20px;
font-size: 88%;
line-height: 1.5em;
color: #666;
background: url(http://www.blogblog.com/tictac_blue/quotes.gif) no-repeat top $startSide;
}

Responder
picheleiro

la foto que quiero poner tiene este url:
http://farm4.static.flickr.com/3009/2806948596_b549feeba5_m.jpg


Gracias y perdona por molestar

Responder
Gem@

Debería ser algo así:
body {
margin: 0;
padding: 0;
font-size: small;
text-align: center;
color: $textcolor;
background:url('http://farm4.static.flickr.com/3009/2806948596_b549feeba5_m.jpg');
}

Responder
Anónimo

no me funciona, me sale una foto antigua que puse un dia en un post y me sale de fondo jifo, moviendose el resto del blog

Responder
Gem@

Sin duda algo no se hizo bien picheleiro, pero si no veo el blog no puedo ayudarte :(

Responder
Anónimo

voy a ver si copio todo el html del blog y te lo pego

Responder
picheleiro

no se que pasa que copio todo el html y no se publica...saludos

Responder
picheleiro

ni siquiera una parte pequeña

Responder
Gem@

picheleiro para que se vea el código hay que convertirlo antes en texto plano, si activas tu perfil o me dejas la dirección del blog puedo verlo.
Si no quieres hacerlo publico también puedes mandar a mi mail la plantilla, pero no la copies manda mejor el archivo xml ;)

Responder
Anónimo

la direccion del blog es www.sdcompostela.tk, gracias

Responder
Gem@

La imagen que tienes es esta click aquí
Lo que tienes que hacer es buscar esa url en la plantilla:
http://img376.imageshack.us/img376/5871/ll52imsksr3.jpg
y eliminarla, luego probar a añadirla como en los pasos que dimos en comentarios anteriores.

Responder
Gem@

Quise decir "probar a añadirla" la imagen de fondo que deseas añadir ;)

Responder
Anónimo

He encontrado esa fotografia, estaba en un chat que tengo puesto en la pagina, pero sigo sin poder poner en las barras laterales, sustituyendo el color azul, por la foto:http://farm4.static.flickr.com/3009/2806948596_b549feeba5_m.jpg
cuando la pongo se me pone las dos barras laterales en blanco solamente,
gracias, por cierto, el blog es www.sdcompostela.tk

Responder
Verónica Benito Cortés

Hola, mi imagen es pequeña y quiero que se repita. ¿Cómo lo hago? y lo segundo, que link debo de cojer en imageshack??

Responder
Gem@

Nika para que se repita basta con añadir:
background:url('aquí la url de tu imagen de fondo');
El link que debes escoger es dinde dice:Direct link to image

Responder
Gem@

picheleiro intenta alojar la imagen en otro servidor, utilizar una entrada del blog es buena idea, luego la dejamos en borrador y seguimos teniendo la imagen alojada.
Añádela conforme los pasos que dimos anteriormente.
body {
margin: 0;
padding: 0;
font-size: small;
text-align: center;
color: $textcolor;
background:url('aquí-url-de-la-imagen');
}

Responder
BLUEGAZER

A mi me ha pasado que en firefox usando fixed la imagen si quedaba estatica pero en IE salia un fondo blanco. Aun actualizando a IE7 el problema seguia. Pero encontre una solucion que hizo que funcionase de maravillas en los dos navegadores.

Este es el codigo que utilize:

body {background-image: url(URL DE LA IMAGEN);
background-position-y: 6px;
background-attachment: fixed; expression( ( 6 + ( ignorar = document.documentElement.scrollTop ? document.documentElement.scrollTop : document.body.scrollTop ) ) + 'px' );;margin:0;color:$textcolor;font: x-small "Trebuchet MS", Trebuchet, Verdana, Sans-serif;font-size/* */:/**/small;font-size: /**/small;
text-align: center;}

Responder
Gem@

Yo lo tengo de esa forma en un par de blogs y se ve el fondo con los dos navegadores BLUEGAZER :)

Responder
Unknown

Auxilio!!! Ya lo intenté mil veces y no sale... dejaré todo ahí por si un día mágicamente aparece mi fondo de textura... jajaja no,mejor me podrías ayudar por favor Gema???

body {
background:url('http://www.mediafire.com/?sharekey=26ffeb08bd2328ffd2db6fb9a8902bda');
background-attachment: fixed
background-repeat: no-repeat;
margin:0px;
padding:0px;
color:$textcolor;
font-size: small;

}

Responder
Unknown

Por cierto... creo que tengo un serio problema cuando se trata de imagenes... igual no pude hacer que me apareciera la imagen tipo globito del número de comentarios en la parte superior derecha.

Igual para publicar mi favicon... acaso es la plantilla?

Responder
Gem@

Pucca estás añadiendo el enlace a la página donde se encuentra la imagen y debe ser la url de la imagen :O

No creo que los problemas sean de la plantilla seguramente es la url de la imagen que deseas añadir. Alójalas en Blogger en una entrada ;)

Responder
Unknown

tengo un problema gordo no se si me podras ayudar , esta es mi pagina http://curi222.blogspot.com/

el problema es que no puedo cambiar los colores de los texos , entonces en las encuestas que yo pongo me salen las letras en negro , y la gente no las ve por que el fondo de la barra lateral es negro

SOCORRO !!!

Responder
majka.

Hola, Gem@!

Me encata tu blog, ya lo sabes! Gracias a ti, todo el día estoy de "mudanza" probando, cositas... GENIAL!

Sinceramente pienso que deberías plantearte hacer clases (a distancia, telemáticas)! ya pagaría por ellas!!!!

pd: MIS ALUMNOS ALUCINAN CONTINGO y les encanta el menú que creaste!!!!!

GRACIAS!!!!!!!

Responder
Gem@

Curi revisa el correo te contesté en la otra entrada :)

Responder
Gem@

¡Hola Majka! jajaja estoy muy lejos de poder dar clases.
Sé lo justito, lo básico y está a tu disposición.
Me alegra verte por aquí, besotes a todo el instituto de la Garriga :)

Responder
Arwen

Hola Gemma ante todo enhorabuena por el blog...y bueno consegui que se me vea en las entradas del blog el fondo y esta estatico pero me aparece la columna a la derecha sin el fondo, se puede hacer algo? te dejo el html y mi blog:
body {
margin-top:0px;
margin-$endSide:0px;
margin-bottom:0px;
margin-$startSide:0px;
font-size: small;
background: url('http://img383.imageshack.us/img383/1407/fondodeplantillatc9.gif');
background-attachment: fixed;
background-repeat:repeat;
color: $mainTextColor;


http://alasdefantasia.blogspot.com/

Responder
Gem@

Saludos Arwen, para que se vea el fondo también en la columna busca en la plantilla donde dice:
#sidebar {
y elimina la línea que dice:
background-color: #000000;

;)

Responder
Arwen

Muchas gracias ya lo puse..ers genial Gemma, siempre atenta y ayudando....que los reyes te traigan mucha felicidad, besazos

Responder
Gem@

Quedó lindo Arwen ;)

Responder
David Jiménez Domínguez

Saludos Gema, mira queria consultarte si se puede sustituir los titulos de las secciones por botones diseñados por mí, es decir, por ejemplo donde pone "Mi Perfil" si puedo poner un boton mio donde ponga Mi perfil pero seria diseñado por mi; y si es asi pues cómo se podría hacer.

Muchas gracias

Responder
Anónimo

Hola he leido alguien que tenia ese problema pero no he visto tu respuesta, tengo una imagen d fondo en blogger y me gustaria que ocupase toda la pantalla sin necesidad de que se tenga que repetir, si le quito el codigo de repetir se me queda en la parte izquierda superior pero no ocupa toda la pantalla, hay algun codido o forma de cambiar en tamaño en html?¿?¿

gtracias

Responder
Gem@

David en la plantilla donde dice
.sidebar h2 { es el sitio sonde personalizamos los títulos de la sidebar.
Mira aquí ;)

yz Carlos si la imagen es una textura o una imagen pequeña utilizamos el valor repeat-x y repetirá la imagen horizontalmente mientras que el valor repeat-y repetirá la imagen verticalmente.
Cuando se trata de una imagen tipo fotografía la única solución es ampliarla hasta dar con el tamaño del fondo. Esto lo conseguimos averiguando la medida en Outer-Wrapper y calculando el alto, casi siempre añadimos el atributo background-attachment: fixed; esto hace que la imagen quede fijada al fondo y siempre se muestre en su totalidad ;)

Responder
Anónimo

ufff es que por mas que cambio la altura y anchura con photoshop y cargo ota diferente siempre se ve en el blog con el mismo tamaño :S

Responder
Gem@

Para que se vea el cambio debes subir la imagen a un servidor (una entrada de Blogger vale) y añadir la nueva url.
Si quieres déjala puesta y me avises que compruebe donde está el error.

Responder
Anónimo

Buenas de nuevo y gracias por las ideas pero mira http://www.antiheroepuntoc.blogspot.com la imagen no ocupa todo el blog y si el pongo el repeat la imagen se repite para rellenar lo que queda vacio pero yo quiero esta imagen que ocupe todo, cambio el tamaño las subo a album picasa copio url pero la imagen siempre ocupa lo que ocupa esto

Responder
Gem@

Lo siento Carlos no la veo, lo mismo la has quitado, si quieres mándala a mi mail que vea el tamaño y como acoplarla a tu plantilla :)

Responder
Luciana "Lula Lanera"

Hola Gema, llevaba tiempo averiguando como hacer que mi fondo quede estatico y que no me ocupe solo los lados sino que se transparente todo, esto ultimo no lo he conseguido pero gracias a este post tuyo pude conseguir que la imagen quede estatica, lo unico es que se ve solo de un lado, como hago para que me quede de los dos? ( al menos eso, ya que no logro que quede transparente y se vaya ese blanco que tengo de fondo en el texto) muchas gracias!

Responder
Gem@

Lula Lanera he accedido a tus blogs pero no veo ese detalle que me comentas, aún así eso que me comentas sucede cuando la imagen no ocupa toda la pantalla y es de unas medidas inferiores al blog.
Sobre la transparencia hay dos entradas que te van a gustar son mis favoritas y hablan sobre añadir una capa de transparencia .. En el buscador añade... transparencias.
De todas formas si deseas dejar completamente transparente sería suficiente con suprimir el color de fondo de las entradas.

Responder
VICKY GALLEGO

hola gema!!! lo he intentando muchas veces y no hay manera de poner la imagen de fondo
body {
background:url (http://img22.imageshack.us/img22/549/peques.jpg);

Responder
Gem@

Vicky le faltan las comillas a la url ;)

background:url('http://img22.imageshack.us/img22/549/peques.jpg');

Responder
Empty*Andrea

Hola! La verdad encontre tu blog de casualidad y me parecio muy bueno, pero no entiendo porque a mi no se me hace nada de esos cambios en mi blog. Yo hago lo que explicas y nada! :S Y los codigos que tu pones a mi me salen diferentes. Si puedes ayudame! Gracias.. un beso que estes bien!

Responder
Gem@

yz Saludos Empty*Andrea :)
La etiqueta body la tenemos todos, explico que en m blog viene con background:#ffffff; porque mi fondo es blanco, pero en el vuestro puede ser de otro color. Por ejemplo el tuyo es negro y viene como:
body {
background:#000000;
Si copias y pegas tal y como viene explicado es imposible que salga diferente ;)

Responder
Harpers Bazaar en español

muchas gracias, super facil, claro con tu ayuda.

Responder
Gem@

yz Harpers Bazaar en español gracias a ti por comentar :)

Responder
Guadiato16

Hola Gem@. Llevo "toa" la tarde "enganchao" a tu Blog. ¡La leche, que descubrimiento!
Al final, solo he conseguido eliminar la plantilla de fondo del mío. No logro que se vea la puñetera imagen que quiero. Así que nada. Borrar cambios y, de momento, a seguir como hasta ahora. Eso si, volveré a "trastearlo".
Enhorabuena por este "peazo" de rincón. No dudes que andaré por aquí. Desde ya te meto en "mis favoritos".;)

Responder
Gem@

yz Gracias por el comentario Guadiato16, seguramente la imagen no sale porque falta algún cierre o la url no es válida, pueden ser mil cosas.
Si me dejas ver lo que añades te podría decir donde está el error ;)

Responder
damytha.chan

Holaa

No me funcionan los cambios, e bsucado en todas las webs, sigo los pasos copio y pego los codigos guardo los cambios me dice blogger que estan guardados los cambios y cuando voy a ver como me quedo sigue igual sin fondo!

Ayudammeee Pliiz!

Responder
Baluverxa Escuela Surf Cabo Peñas

Hola Gema,estoy intentando poner en mi blog una imagen de fondo y nada,estoy haciendo lo que dices,o eso creo,y cuando doy en vist previa sale igual o toda la pagina en blanco,mi plantilla se llama Son of Moto,te pongo lo que estoy haciendo,espero que me puedas ayudar,mil gracias
body {
margin: 0;
padding: 0;
border: 0;
text-align: center;
color: $mainTextColor;
background: #692 url(http://www.hiboox.es/go/imagenes/deportes/jueves9octubre08-002,9a737d3a03bb8e6d0e4c666a12af749d.jpg.html) top center repeat-y;
font-size: small;

Responder
Gem@

yz baluverxasurfclub he visto que ya lo has solucionado :)

Responder
José Luis Expósito

Gracias, muy bien explicado

Responder
Gem@

yz Gracias a ti Jose :)

Responder
_

Hola Gema, he caído por aquí por casualidad y me ha encantado el truco. Gracias!

Responder
_

Ah! Por cierto una preguntilla, se puede hacer algo para que al minimizar la pantalla el fondo cambie de tamaño a la vez que hacemos la pantalla más pequeña?? Gracias, muchas gracias!

Responder
Gem@

yz Lo ideal sería la solución que le has dado añadir como fondo una imagen tipo textura :)

Responder
aviones

:) olaa

mi nombre es alexis i no se como se hace un fondo piolaa mui buen blog


i salu2

Responder
FOTONORTE

hola gema!!!! te comento....hay algo q no me sale bien.....cuando aplico la url de la imagen donde tu indicas guardo plantilla y el fondo del blogs se pone todo blanco...yo estoy usando la plantilla mìnima black....cual serìa la plantilla q me harìa màs facil el cambio del fondo.....te agradezco de corazòn los aportes q le das a la comunidad bloggera..te envio besos...

Responder
Gem@

yz Hay generadores para crear fondos Alexis, sobre la forma de añadirlo simplemente sigue los pasos dados y si algo no te funciona me lo dices y vemos como solucionarlo :)

yz Marcelo déjame la url del blog por favor ;)

Responder
kratos

muchas gracias tus datos me han servido mucho para mi pagina

Responder
Gem@

yz Me alegra que así sea kratos, te quedó lindo el efecto :)

Responder
chaporockmetal

Buenisimo GEMA!!!!!!! muchas gracias me quedo super bien, de verdad muchas gracias ;) pasate para que veas como me quedo =)
www.animedescargas.blogspot.com

Responder
Gem@

yz Muy bueno chaporockmetal, me alegra que resultara bien :D

Responder
Gem@

yz chaporockmetal si añades la imagen de la siguiente forma
background:url('http://mindfriki.webcindario.com/Anime/wallpapers-anime-2-1024.jpg') no-repeat top;

y eliminas la línea de background-repeat: no-repeat;
conseguirás que la imagen se centre, también puedes añadir un color de relleno acorde con la imagen si lo haces de esta forma:

background:#2F2F2F url('http://mindfriki.webcindario.com/Anime/wallpapers-anime-2-1024.jpg') no-repeat top;

Sustituyes #2F2F2F por otro color ;)

Responder
Marga

Hola Gema !!!
Hace tiempo que no te "molestaba" y aquí estoy de nuevo !!
Estoy intentando en un blog de pruebas poner un fondo y que quede fijo. Bien, ningún problema, pero querría poner en el main y en la sidebar, un color liso porqué ahora me sale todo el fondo igual.
La plantilla es una mínima. O sea, como tu blog que lo tiene blanco.
Gracias y espero hayas disfrutado de unas merecidas vacaciones.
Marga

Responder
The_JackPot

Gracias como 100pre encuentro exactamente lo que busco en tu blog....

Responder
About Us~

Muchas gracias!! :3

Responder
Gem@

yz Siento ver tu comentario con tanto retraso Marga ¿solucionado ya?

yz Gracias por el comentario JackPot :)

yz Saludos Rena Kamijô, gracias por comentar :)

Responder
otlaltepec

hola gema, por mas que intente con varios codigos simpre el fondo queda en blanco, que puedo hacer??

Responder
Gem@

yz server es sencillo, en tu plantilla donde dice:
body {
background:#000000;

debes poner:
body {
background:url('aquí tu imagen de fondo');

Donde dice aquí tu imagen de fondo debes sustituirlo por la url de la imagen que deseas añadir, para conseguir la url debes antes subir la imagen a un servidor, una entrada de Blogger es válida.
Una vez subida a la entrada te posicionas en la pestaña de HTML y copias la url para pegarla más tarde en la plantilla donde dice aquí tu imagen de fondo (las comillas no debes quitarlas)

Luego, esa entrada la dejas en borrador o la eliminas sin marcar para eliminar la imagen y listo.

Responder
Mari Feli

Gracias por la ayuda intentaré hacerlo

Responder
Gem@

:: Gracias por comentar Mari Feli :)

Responder
Anónimo

primero que todo gracias me sirvio mucho la informacion, pero nose que me pasa, pude montar la imagen peros e ve muy pequeña y es raro ya que tiene muy buena resolucion, si me pudieras dar algun concejo te lo agradeceria

Responder
Gem@

:: Saludos Axzavel, si me dices en qué blog la añadiste podemos mirarla :)

Responder
Víctor Díaz

me salio al 100% gracias por la ayuda!!! :D :D

Responder
Gem@

:: Genial Hak@n, tenemos el mismo gusto :)

Responder
Fans Tribute of Michael Jackson

Muchas gracias!
me ayudo mucho :)

Responder
Gem@

:: Genial :D

Responder
martmas

Me encanta este blog. Felicidades
Estoy peleándome para poder poner una foto de fondo del blog y que aparezca en toda la pantalla. Releuendo todo este post creo que sé cómo solucionarlo. Voy a intentarlo de nuevo
Repito, muchas felicidades por este riconcito

Responder
Gem@

:: martmas no sé si ya añadiste la imagen de fondo porque tienes varios blogs y no sé de qué blog se trata pero si te surgen dudas házmelo saber hay otras opciones para añadir una imagen de fondo, esta en concreto lo que hace es que sea estática (se fija al fondo) pero es importante saber ubicarla ;)

Responder
Kas-Tro

Hey mira tengo un problema en mi blog le puse un fondo http://prueba2056.blogspot.com/ pero cuando hago las pruevas en diferentes resoluciones el fondo se mueve y no queda como se tiene que ver mira este blog tiene el fondo y lo prove en diferentes resoluciones y no se mueve http://www.loquetuquiere.com/ si me podrias ayudar te lo agrederia mucho :O

Mi Resoluciones 1440x900 en la que lo prove

Responder
Gem@

:: Ese blog que me muestras tiene la imagen en

#page{background:transparent url(url-imagen-fondo) no-repeat center top;}
y luego tiene añadida una textura en:

body{background:#000 url(url-imagen) repeat-x center bottom;

La textura es esta:
http://i43.tinypic.com/2rp4ghk.jpg

Responder
Kas-Tro

sustitui esto codigos
background:url('http://img202.imageshack.us/img202/4918/fondoprueva.jpg');
background-attachment: fixed;
background-repeat: no-repeat;

Por estos
#page{background:transparent url(http://img202.imageshack.us/img202/4918/fondoprueva.jpg) no-repeat center top;}
body{background:#000 url(uhttp://i43.tinypic.com/2rp4ghk.jpg) repeat-x center bottom;

y se me distorciono la plantilla como hago para que me quede igual que el blog que te mande para despues poder crear el fondo como kiero..

Responder
Gem@

:: No es tan sencillo que las imágenes de una plantilla queden perfectas en otra a no ser que las medidas sean las mismas o la plantilla sea idéntica. Prueba añadiendo el fondo siguiente en #outer-wrapper y vemos el resultado:
background:transparent url(http://img202.imageshack.us/img202/4918/fondoprueva.jpg) no-repeat center top;}

Responder
Kas-Tro

Como me dijste se fue al lado el blog pero de esta forma logre algo
* {margin:0; padding:0;}

body {background:#000 url(http://i43.tinypic.com/2rp4ghk.jpg) repeat-x center bottom;
margin: 0px 0px 0px 0px;
padding: 0px 0px 0px 0px;
text-align: center;
color: $textColor;
background:transparent url(http://img202.imageshack.us/img202/4918/fondoprueva.jpg) no-repeat center top;}
font-family: arial,verdana,helvetica,tahoma,Sans-serif;
font-size: 100%;
width: 100%;
}

pero hay una parte que sale blanca y no se por que y lo prove en varias resoluciones y bien solo falta lograr que aparesca la otra textura o quitar la parte blanca y ponerla negra.. y disculpa tanta molestia.

Responder
Gem@

:: En tu código yo veo que tienes esto:
body {background:#000 url(http://i43.tinypic.com/2rp4ghk.jpg) repeat-x center bottom;
margin: 0px 0px 0px 0px;
padding: 0px 0px 0px 0px;
text-align: center;
color: #aaaaaa;
background:transparent url(http://img202.imageshack.us/img202/4918/fondoprueva.jpg) no-repeat center top;}<---este cierre sobra porque los estilos continúan.
font-family: arial,verdana,helvetica,tahoma,Sans-serif;
font-size: 100%;
width: 100%;
}

así lo que estás añadiendo son dos imágenes de fondo, yo añadiría la imagen central en #outer-wrapper de esta forma:
#outer-wrapper {
background:#000 url(http://img202.imageshack.us/img202/4918/fondoprueva.jpg) no-repeat center top;
margin: 0 auto; /* auto - to make the template lay in the screen center */
padding: 0px 0px 0px 0px;
margin-top: 0px;
margin-bottom: 15px;
position: relative;
width: 100%;
text-align: center;
}

y la otra imagen del degradado en el fondo del blog:

body {
background:#000 url(http://i43.tinypic.com/2rp4ghk.jpg) repeat-x;
margin: 0px 0px 0px 0px;
padding: 0px 0px 0px 0px;
text-align: center;
color: #aaaaaa;
font-family: arial,verdana,helvetica,tahoma,Sans-serif;
font-size: 100%;
width: 100%;
}

De esa forma a mi me queda todo centrado y las imágenes ocupan su sitio, el espacio ese blanco que dices lo completamos de color negro.



































<

lo que hay que añadir

Responder
Kas-Tro

hey gracias me has ayudado mucho, pero mira si pego el body solo me sale el degradado arriva pero cuando pego el #outer-wrapper en vez de aparecer abajo como esta aqui http://www.loquetuquiere.com/ desaparece miralo que lo tengo puesto en mi plantilla de prueba http://prueba2056.blogspot.com/ y perdona tanta moletia pero creo que solo tala que salgan los dos..

Responder
Gem@

:: Pues la única forma de mostrar un degradado a lo largo es esa, añade en body de esta forma:

background-color: #000;
background-image:url(http://i43.tinypic.com/2rp4ghk.jpg);
background-repeat: repeat-x;

Responder
Kas-Tro

lo añadi asi y no paso nada se kedo totalmente igual no veo el degradado por ningun lado
body {
background-color: #000;
background-image:url(http://i43.tinypic.com/2rp4ghk.jpg);
background-repeat: repeat-x;
margin: 0px 0px 0px 0px;
padding: 0px 0px 0px 0px;
text-align: center;
color: #aaaaaa;
font-family: arial,verdana,helvetica,tahoma,Sans-serif;
font-size: 100%;
width: 100%;
}

Responder
Andrea Gomez

Holaaa como estas quisiera que xfavor me ayudaras mira lo que pasa es q yo tengo mi blog es wwwjustinbieberecuador.blogspot.com y ya pongo la imagen y todo pero donde pongo las noticias quisiera que quedara negro como aqui en tu blog donde escribes queda blanco no transparente ayudame porfavor quisiera que quedara asi http://justin-bieber-argentina.blogspot.com/ Muchas gracias

Responder
Gem@

:: Esa parte la veo de color negro en tu blog Andrea :S

Responder
FUTBOLXONLINE | Futbol Mexicano en Hd

:)
graxias si me funciono

Responder
Juan ORTiz DELgado

Hola Gema, otra vez dando la lata.
Estoy intentando cambios en uno de mis blogs que en este momento tiene la plantilla predefinida "Scribe". Como son bastantes los cambios decidí que lo más cómodo era empezar desde una plantilla clásica básica copiando ciertas cosas de la Scribe: la imagen de fondo y la que parece ocupa el outer-wrapper. El problema es que ésta en realidad son tres (arriba-medio-abajo)que no ocupan completamente el outer-wrapper y están sobre un fondo plano marrón de forma que se crea una marco de este color.

Al no parecerse demasiado la estructura de la plantilla clásica con la Scribe no me doy aclarado. ¿Le ves fácil solución o directamente me dejo de líos y pongo la imagen intermedia en todo el outer-wrapper, que tampoco queda tan mal?

Muchas gracias.

Responder
pulgatomika

Hola Gema, me gustaría hacerte una consulta,referente a las imagines estáticas en el blog, que se pueden poner una imagen estática en una pagina independiente de blogger, pero solo a una no a todas las paginas independientes.
Espero a verme explicado bien.
Saludos y felicidades por el blog.

Responder
Gem@

:: pulgatomika puedes añadir el fondo en la misma entrada de esta forma:
<table background="url-de-la-imagen" border="0"
bordercolor="#000000" cellpadding="0" cellspacing="0"height="100%"
width="100%"><tbody><tr><td><p>
texto-texto-texto-texto-texto
</p><p></p></td></tr></tbody></table>

Responder
pulgatomika

@Gem@
Gracias Gema me sale bien pero como hago para que la imagen no se repita todo el rato, me gustaría que se quedara la imagen fija, a ver si me explico bien que solo se mueva el contenido de la pagina independiente y la imagen se quede fija.Es que solo hace que repetirse la imagen y la verdad es que no que nada bien.
Saludos y muchas gracias por tu ayuda.

Responder
Mari Sol

:P muchas gracias

Responder
Gem@

:: De nada may, bienvenida :)

:: pulgatomika lamento ver el comentario ahora ¿ya está solucionado?

Responder
Krone

Hola, ;D este comentario no es en realidad para comentar sobre el post sino mas para que si podes me puedas explicar una cosita...
el siguiente link es de una imagen.jpg que al recargar cambia la imagen... como es eso posible ??
"http://www.chatroulette.com/home/get_bg/bg.jpg"
es un .jpg no tiene html ni nada es solo una imagen como hace para cambiar ?? es muy raro no entiendo :/

Responder
Gem@

:: Krone es algo así como un Random de imágenes
http://gemablog-.blogspot.com/2008/09/random-de-imgenes-como-fondo-del-blog.html
Aunque en este caso que muestras es con una sola url, hay páginas de generadores de ese estilo, subes las imágenes y genera un random.

Responder
Sofi

no entendí mucho para que esta esos #fffff
Por favor espliquemenlo porfis!!!!
:) :'( :( :P :D :$ ;) :-I :X :O |O :S

Responder
gab

hola gema,que buen descasno la que tuvo. Me gustaria que me oriente en eso de la imagen fijo en los post, el problema es que no encuentro lo que mencionas en el post, ya que en minima lo tenia, y ahora que cambie a fabtastico, no puedo, espero puedas darme tu ayuda, gracias.
y saluditos.

Responder
gab

@Sofi es lo que se iidentifica a los colres como al negro es#00000, y y asi como muchos mas, suerte.

Responder
Gem@

:: Sofi eso es un ejemplo de color de fondo que puede tener el blog como bien dice Gab ese código #ffffff sería color blanco y background quiere decir fondo.


:: gab explícame eso que deseas hacer en los post ... quieres una imagen de fondo en los post?

Responder
Gem@

amatry siento llegar tarde esta vez, veo que ya lo has solucionado :)

amatry

Gracias Gema por tu respuesta.Como no podía resolverlo y además no le tenía ningún cariño especial al fondo pués lo cambié.
Según un dicho popular:"Muerto el perro se acabó la rabia"
Gracias

Responder
Silsoles
Este comentario ha sido eliminado por el autor.
Responder
Silsoles

Hola Gema,

Enhorabuena por tu blog! He escrito antes un comentario y lo he borrado sin querer. He quitado la sidebar de una página estática para que se quede una página totalmente en blanco para editar. Quiero añadir imágenes centradas (a modo de portfolio, no de cabecera) y cada una con un título (como si fuera un post). EL problema es que no puedo centrar las imágenes, lo intento con html poniendo align center y con el modo de añadir imagen directamente y poniendo la opción alinear centro y tamaño original. Cómo puedo alinear el contenido de una imagen estática? Gracias y saludos!

Gem@

Pensaba que te había respondido días atrás y ahora me encuentro que no ha sido así :S
La forma de centrar un contenido con HTML en una página estática es igual que para un post cualquiera, puedes probar en un post y pegar luego el HTML en esa página.
Otra forma de centrar algo es con la clásica y cada vez menos usada etiqueta center <center> contenido </center>
También puede ser que el código no sea correcto, si me dices dónde está ese ejemplo podemos verlo.

Responder

Los comentarios han sido inhabilitados temporalmente. ¡GRACIAS!

:):'(:(:P:D:$;):-I:X:O|O:S

Nota: solo los miembros de este blog pueden publicar comentarios.

 


top